<br/>
<div class="setting-container">
  <div style="display: table-row">
    <div class="setting-card-padding"></div>
    <div class="setting-card mdl-card mdl-shadow--2dp">
      <div class="mdl-card__title mdl-card--expand">
        <h2 class="mdl-card__title-text">SETTINGS</h2>
      </div>
      <div class="mdl-card__actions mdl-card--border">
        <div class="mdl-card__supporting-text">
          Content Services host URL configuration
        </div>
        <nav class="mdl-navigation">
          <div class="icon material-icons icon-margin">link</div>
          <input type="text" class="mdl-textfield__input" id="ecmHost" data-automation-id="ecmHost"
                 tabindex="1" (change)="onChangeECMHost($event)" value="{{ecmHost}}"/>
        </nav>

        <div class="mdl-card__supporting-text">
          Process Services host URL configuration
        </div>
        <nav class="mdl-navigation">
          <div class="icon material-icons icon-margin">link</div>
          <input type="text" class="mdl-textfield__input" id="bpmHost" data-automation-id="bpmHost"
                 tabindex="1" (change)="onChangeBPMHost($event)" value="{{bpmHost}}"/>
        </nav>
      </div>
      <div class="mdl-card__actions mdl-card--border">
        <a class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect" onclick="window.history.back()" >
          Back
        </a>
      </div>
    </div>
    <div class="setting-card-padding"></div>
  </div>
</div>
